<!-- user信息-->
<form id="userForm" lay-filter="userForm" class="layui-form" style="height: 100%; margin: 0 10px;">
    <div style="padding: 5px;"></div>
    <div class="layui-form-item">
        <div class="layui-row">
            <div class="layui-col-md4">
                <label class="layui-form-label"></label>
                <div class="layui-input-inline" style="width: 60px;">
                    <img style="width: 64px; height: 64px;" name="avatar" id="avatar" src=''>
                </div>
            </div>
            <div class="layui-col-md8">
                <div class="layui-row">
                    <label class="layui-form-label">登录帐号：</label>
                    <div class="layui-input-inline">
                        <div name="loginAccount" id="loginAccount" style="height: 38px; line-height: 38px;"></div>
                    </div>
                </div>
                <div class="layui-row">
                    <label class="layui-form-label">创建时间：</label>
                    <div class="layui-input-inline">
                        <div name="createTime" id="createTime" style="height: 38px; line-height: 38px;"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <hr>
    <div class="layui-form-item">
        <label class="layui-form-label">用户名：</label>
        <div class="layui-input-inline">
            <input name="userName" id="userName" placeholder="请输入用户名，必填" type="text" class="layui-input layui-disabled" disabled/>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">手机号：</label>
        <div class="layui-input-inline">
            <input name="mobile" id="mobile" placeholder="请输入手机号，必填" type="text" class="layui-input layui-disabled" disabled/>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">邮箱：</label>
        <div class="layui-input-inline">
            <input name="email" id="email" placeholder="请输入邮箱，必填" type="text" class="layui-input layui-disabled" disabled/>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">性别：</label>
        <div class="layui-input-inline">
            <div id="sex" name="sex"></div>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">状态：</label>
        <div class="layui-input-inline">
            <div id="userState" name="userState"></div>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">职位：</label>
        <div class="layui-input-inline">
            <input name="title" id="title" placeholder="请输入职位，必填" type="text" class="layui-input"
                   lay-verify="required" required/>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">登录账号：</label>
        <div class="layui-input-inline">
            <input name="loginAccount" id="loginAccount" placeholder="请输入登录账号，必填" type="text" class="layui-input layui-disabled" disabled/>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">个人介绍：</label>
        <div class="layui-input-block">
            <textarea name="description" id="description" placeholder="请输入个人介绍" class="layui-textarea layui-disabled" disabled></textarea>
        </div>
    </div>
</form>

<script>
    layui.use(['layer', 'base', 'form', 'xmSelect'], function () {
        var $ = layui.jquery,
        layer = layui.layer,
        base = layui.base,
        form = layui.form,
        xmSelect = layui.xmSelect;

        xmSelect.render({
	        el: '#sex',
	        radio: true,
	        clickClose:true,
			layVerType: 'msg',
            disabled: true,
			size: 'mini',
			theme: {
                color: base.xmSelectTheme,
            },
			model: {
				icon: 'hidden',
				label: {
					type: 'text',
				}
			},
	        data: []
		})

        xmSelect.render({
	        el: '#userState',
	        radio: true,
	        clickClose:true,
            disabled: true,
			layVerType: 'msg',
			size: 'mini',
			theme: {
                color: base.xmSelectTheme,
            },
			model: {
				icon: 'hidden',
				label: {
					type: 'text',
				}
			},
	        data: []
		})

        var sysUser = base.getSessionData('fs_user');
        if(sysUser){
            openUserForm('/baseService/user/editForm/'+sysUser.id);
        }
        else{
            openUserForm('/baseService/user/initForm');
        }
        //打开用户表单
        function openUserForm(url){
            base.fsAjax(url, {}, function (data) {
               layer.closeAll('loading');
               if (data.code == 200) {
                    data = data.data;
                    xmSelect.get('#sex',true).update({
                        data: data.sexList
                    })
                    xmSelect.get('#userState',true).update({
                        data: data.userStateList
                    })
                    $("#avatar").attr('src', "\\src\\img\\avatar\\"+data.avatar);
                    $("#loginAccount").html(data.loginAccount);
                    $("#createTime").html(data.createTime);
                    form.val('userForm', data);
                    form.render();
               } else {
                    base.msgError(data.msg);
               }
           },  "POST");   
        }
 		
        // 表单提交事件
        form.on('submit(userFormSubmit)', function (data) {
            var url = '/baseService/user/editUser';
            if( data.field.id === ''){
                url = '/baseService/user/addUser'; 
            }
            data.field.sex = xmSelect.get('#sex', true).getValue('valueStr');
            data.field.userState = xmSelect.get('#userState', true).getValue('valueStr');
            base.fsAjax(url, JSON.stringify(data.field), function (data) {
                layer.closeAll('loading');
                if (data.code == 200) {
                    base.msgSuccess(data.msg);
                    base.close();
                } else {
                    base.msgError(data.msg);
                }
            },  "POST");
            return false;
        });
    });
</script>